<template>
    <div class="addAdult">
        <div class="add_item" @click="outerVisible = true">添加后台用户</div>
        <!-- 添加后台用户 -->
        <div class="dialog_from">
            <el-dialog title="添加后台用户" :modal=false :close-on-click-modal=false :visible.sync="outerVisible">
                <el-form :model="form">
                    <el-form-item label="登录名：" :label-width="formLabelWidth">
                        <el-input v-model="form.username"></el-input>
                    </el-form-item>
                    <el-form-item label="密码：" :label-width="formLabelWidth">
                        <el-input type='password' v-model="form.password"></el-input>
                    </el-form-item>
                    <el-form-item label="Email：" :label-width="formLabelWidth">
                        <el-input v-model="form.email"></el-input>
                    </el-form-item>
                    <el-form-item label="真实姓名：" :label-width="formLabelWidth">
                        <el-input v-model="form.realname"></el-input>
                    </el-form-item>
                     <el-form-item label="英文名：" :label-width="formLabelWidth">
                        <el-input v-model="form.enname"></el-input>
                    </el-form-item>
                     <el-form-item label="手机号：" :label-width="formLabelWidth">
                        <el-input v-model="form.mobile"></el-input>
                    </el-form-item>
                     <el-form-item label="QQ：" :label-width="formLabelWidth">
                        <el-input v-model="form.qq"></el-input>
                    </el-form-item>
                     <el-form-item label="Skype：" :label-width="formLabelWidth">
                        <el-input v-model="form.skype"></el-input>
                    </el-form-item>
                    <el-form-item label="用户组：" placeholder="选择用户组" :label-width="formLabelWidth">
                        <el-select v-model="form.roleid">
                            <el-option v-for='(role,i) in roleList' :key='i' :label='role.name' :value="role.id"></el-option>
                        </el-select>
                    </el-form-item>
                </el-form>
                <div slot="footer" class="dialog-footer">
                    <el-button class="dialog_close" @click="outerVisible = false">关闭</el-button>
                    <el-button class="dialog_confirm" type="primary" @click="addUser">保存</el-button>
                </div>
            </el-dialog>
        </div>
    </div>
</template>
<script>
import base from '../../api/base.js'
import md5 from 'js-md5'
export default {
    inject:['reload'],
    data() {
        return {
                roleList:'',//角色列表
                outerVisible: false,
                form: {
                    username:'',
                    password:'',
                    email:'',
                    realname:'',
                    enname:'',
                    mobile:'',
                    qq:'',
                    skype:'',
                    roleid:'',
                },
                // 表格
                formLabelWidth: '160px',
                columWidth:140,
                align:'center',
        };
    },
    methods:{
        getRoleList(){
            this.$axios({
                url: base.baseUrl+"/school/setting/get-role-list",
                method: "POST",
                header: { 'content-type': 'application/x-www-form-urlencoded' },
                data:{
                    token:localStorage.token
                },
                transformRequest: [function (data) {
                    let ret = ''
                    for (let it in data) {
                        ret += encodeURIComponent(it) + '=' + encodeURIComponent(data[it]) + '&'
                    }
                    return ret
                }],
            }).then(res => {
                if(res.data.code==200){
                    this.roleList=res.data.data;
                }else if(res.data.code==-2){
                    this.$router.push('/login');
                } 
            });
        },
        addUser(){
            
            this.$axios({
                url: base.baseUrl+"/school/agent/add-user",
                method: "POST",
                header: { 'content-type': 'application/x-www-form-urlencoded' },
                data:{
                    token:localStorage.token,
                    username:this.form.username,
                    password:md5(this.form.password),
                    email:this.form.email,
                    realname:this.form.realname,
                    enname:this.form.enname,
                    mobile:this.form.mobile,
                    qq:this.form.qq,
                    skype:this.form.skype,
                    roleid:this.form.roleid
                },
                transformRequest: [function (data) {
                    let ret = ''
                    for (let it in data) {
                        ret += encodeURIComponent(it) + '=' + encodeURIComponent(data[it]) + '&'
                    }
                    return ret
                }],
            }).then(res => {
                if(res.data.code==-1){
                    this.alertTip(res.data.msg)
                }else if(res.data.code==200){
                    this.$alert('添加成功', '提示', {
                        confirmButtonText: '确定',
                        callback: action => {
                            this.reload()
                            this.outerVisible = false
                        }
                    });
                }
            });
        },
        alertTip(msg){
            this.$alert(msg, '提示', {
                confirmButtonText: '确定',
                callback: action => {
                    this.$message({
                        type: 'info',
                    });
                }
            });
        }
    },
    created(){
        this.getRoleList()
    }
};
</script>

